<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    *{
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    body{
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: rgb(0, 0, 0);
    }
    svg{
          border: 1px solid rgba(233, 233, 233, 0.9);
          box-shadow: inset 0 0 15px rgba(233, 233, 233, 0.9);
          cursor: pointer;
          transition: all 1.5s;
    }
    .hua{
        fill: transparent;
        stroke: white;
        stroke-width: 5px;
       stroke-dasharray: 1235;
       stroke-dashoffset: 1235;
       transition: all 1.5s;

    }
    svg:hover{
        box-shadow: inset 0 0 15px rgba(233, 233, 233, 1),
        inset 0 0 20px rgba(233, 233, 233, 1);

    }
    svg:hover .hua{
        stroke-dashoffset: 0;
            fill: red;

        /* animation: move 2s linear forwards; */
    }
    /* @keyframes move{
        0%{
            stroke-dashoffset: 1230;
            fill: transparent;
        }
        50%{
            stroke-dashoffset: 0;
            fill: transparent;
        }
        100%{
            stroke-dashoffset: 0;
            fill: red;
        }
    } */
</style>
<body>
   
    <svg  viewBox="0 0 1024 1024"  width="300" height="300" >      
        <path  class="hua"  d="M626.915 506.525z m28.242-295.422c-37.145-57.099-75.006-107.854-35.098-161.985-42.876-10.029-77.156 17.088-82.068 53.415-69.89 34.178-48.4 91.277-34.177 145.511 35.712 17.191 72.141 49.322 97.11 87.184 9.311 14.94 18.623 29.982 22.819 45.638 7.163 22.82 2.865 32.848 0.102 58.532 0 5.73 3.581 19.238 4.298 27.117 2.149 5.014 3.581 10.642 4.297 14.224 0.717 10.744-2.148 19.237-5.73 25.684 18.522-15.656 41.34-32.847 47.685-59.248 2.865-11.46 6.447-20.67 7.88-29.266 8.493-31.415 19.237-29.266 24.251-68.458 8.698-54.029-22-94.756-51.369-138.348zM482.53 236.686c0.717-12.178-37.963-97.826 31.313-138.45-67.844-49.323-168.535 11.255-160.553 89.025 27.014-24.15 83.5-4.81 129.24 49.425z m140.804 271.988z m0 0c2.15-5.014 3.582-10.642 2.865-19.954 0.717-5.014-2.148-12.074-4.297-18.521-2.15-6.447-3.582-14.94-3.582-23.536-1.432-7.163-0.716-13.61-0.716-20.67 0.716-12.177 0-22.82-4.298-35.713-17.191-54.234-80.02-114.3-125.761-125.659-73.677-83.602-119.315-72.244-145.716-54.439-23.536-12.177-79.305 0.614-102.738 38.476 84.933-0.716 123.613 190.638 186.545 236.276 54.336 38.578 71.425 24.354 112.05 37.964 35.61 8.596 62.01-2.047 85.648-14.224z m13.098 55.36c2.252-12.28 9.824-21.898 13.815-29.164 11.46-23.944 35.2-55.973 33.768-82.988-9.619 35.201-39.09 70.914-88.923 81.658-19.647 3.99-45.434 6.958-69.89-6.651 21.386 18.828 47.377 22.717 90.253 39.806l11.768-1.433c87.593 201.484-2.865 379.434-2.865 379.434 123.408-177.13 45.229-326.94 8.697-380.15l3.377-0.512z"
            p-id="4170"></path>
    </svg>
</body>

</html>